import React, { useEffect, useState } from "react";
import { Descriptions, Card, Button } from "antd";
import { getHosListDetailRequest ,} from "@/api/hospital/hospitalList";
import { useNavigate, useParams } from "react-router-dom";
import { hospitalDetailReturnType } from "@/api/hospital/model/hospitalListTypes";


export default function HospitalShow() {
    const {id} = useParams()
    const navigator = useNavigate()
    const [datail,setDatail] = useState<hospitalDetailReturnType>()

    useEffect(()=>{
        const getshowList =async  ()=>{
            const result = await  getHosListDetailRequest(id  as string) 
            setDatail(result)
            console.log(result);
            
        }
        getshowList()
    },[])


  return (
    <Card>
      <Descriptions title="基本信息" bordered column={2}>
        <Descriptions.Item label="医院名称">{datail?.hospital.hosname}</Descriptions.Item>
        <Descriptions.Item label="医院logo">{datail?.hospital.logoData?(<img width={100} src={
            `data:image/jpeg;base64,${
                datail?.hospital.logoData
              }` }  alt=''
              />):('')}</Descriptions.Item>
        <Descriptions.Item label="医院编码">{datail?.hospital.hoscode}</Descriptions.Item>
        <Descriptions.Item label="医院地址">{datail?.hospital.param.fullAddress}</Descriptions.Item>
        <Descriptions.Item label="医院坐车路线" span={2}>
        {datail?.hospital.route}
        </Descriptions.Item>
        <Descriptions.Item label="医院简介" span={2}>
        {datail?.hospital.intro}
        </Descriptions.Item>
      </Descriptions>

      <Descriptions
        title="预约规则信息"
        bordered
        column={2}
        style={{ marginTop: "30px" }}
      >
        <Descriptions.Item label="预约周期">{datail?.bookingRule.cycle}</Descriptions.Item>
        <Descriptions.Item label="放号时间">{datail?.bookingRule.releaseTime}</Descriptions.Item>
        <Descriptions.Item label="停挂时间">{datail?.bookingRule.stopTime}</Descriptions.Item>
        <Descriptions.Item label="退号时间">{datail?.bookingRule.quitTime}</Descriptions.Item>
        <Descriptions.Item label="预约规则" span={2}>
        {datail?.bookingRule.rule.map(( item ,index)=>{
            return <p key={index}>{item}</p>
        })}
        </Descriptions.Item>
      </Descriptions>

      <Button style={{ marginTop: "30px" }} onClick = {()=>{ navigator(-1)}}>返回</Button>
    </Card>
  );
}
